<!-- 添加简历来源 -->
<template>
	<view class="container">
		<view class="resume-bigbox">
			<view class="form-item cu-form-group">
				<view class="title">*来源名称</view>
				<input placeholder="请输入" name="input" class="text-r" v-model="name" />
			</view>
			<view class="cu-form-group cu-from-change">
				<view class="title">*地址</view>
				<mpvue-city-picker :themeColor="themeColor" ref="mpvueCityPicker" :pickerValueDefault="cityPickerValueDefault"
				 @onCancel="onCancel" @onConfirm="onConfirm" />
				<view @tap="showMulLinkageThreePicker" class="address-sty">{{area_str || "请选择"}}</view>
				
			</view>
			<view class="form-item cu-form-group">
				<view class="title">*详细地址</view>
				<input placeholder="请输入" name="input" class="text-r" v-model="address" />
			</view>
			<view class="form-item cu-form-group">
				<view class="title">*联系人</view>
				<input placeholder="请输入" name="input" class="text-r" v-model="contact" />
			</view>
			<view class="form-item cu-form-group">
				<view class="title">*电话</view>
				<input placeholder="请输入" name="input" class="text-r" v-model="phone" />
			</view>
			<view class="set-topborder">
				<view class="title1">备注</view>
				<view class="content-item-con">
					<textarea class="text-area-item" v-model="remark" placeholder="请输入"></textarea>
				</view>
			</view>
		</view>
		<view class="btn-item submit-btn-item flex rcc" @tap="handleClickConfirm">
			<text class="btn-item-title">确定</text>
		</view>
	</view>
</template>

<script>
	import mpvueCityPicker from '../../components/mpvue-citypicker/mpvueCityPicker.vue'
	export default {
		components: {
			mpvueCityPicker,
		},
		data() {
			return {
				token: '',
				item: {},
				id: '',
				// 后台传得数据
				contact: '', // 联系人
				phone: '', // 电话
				area_str: '', // 详细地址
				address: '', // 详细地址
				remark: '', // 备注
				name: '', // 渠道名称
				area: '',
				cityPickerValueDefault: [0, 0, 0],
				region: ['','',''], // 地址选择
				msg: '', // 错误提示
				index: -1,
				picker: ['喵喵喵', '汪汪汪', '哼唧哼唧'],
				time: '12:01',
				modalName: '',
				themeColor: '#007AFF',
			}
		},
		onLoad(option) {
			if (option.item) {
				let item = JSON.parse(option.item);
				console.log('item---->', item);
				this.item = item;
				this.id = item.id;
				this.contact = item.contact;
				this.phone = item.phone;
				this.address = item.address;
				this.remark = item.remark;
				this.name = item.name;
				this.region = [item.province, item.city];
				this.area_str = item.province + '-' + item.city;
			}
		},
		methods: {
			onCancel(e) {
				// console.log(e)
			},
			// 三级联动选择
			showMulLinkageThreePicker() {
				this.$refs.mpvueCityPicker.show()
			},
			onConfirm(e) {
				console.log('value---->', e);
				let value = e.label;
				this.region = value.split('-');
				this.area_str = this.region[0] + '-' + this.region[1];
			},
			// 点击确定提交数据
			async handleClickConfirm() {
				var pages = getCurrentPages();
				var currPage = pages[pages.length - 1]; //当前页面
				var prevPage = pages[pages.length - 2]; //上一个页面
				//直接调用上一个页面的setData()方法，把数据存到上一个页面中去
				prevPage && prevPage.setData && prevPage.setData({
					isDoRefresh: true
				});
				// 发请求
				let url = this.ServicesApi.addNewResumeChannel;
				let data = {
					id: this.id,
					name: this.name,
					province: this.region[0],
					city: this.region[1],
					district: this.region[2],
					address: this.address,
					contact: this.contact,
					phone: this.phone,
					remark: this.remark,
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					uni.showToast({
						icon: 'none',
						title: result.msg,
					});
					setTimeout(() => {
						uni.navigateBack({
							delta: 1,
							animationType: 'pop-out',
							animationDuration: 200
						});
					}, 1500);
				} else {
					uni.showToast({
						icon: 'none',
						title: result.msg,
					});
				}
			},
			// 地址选择
			RegionChange(e) {
				uni.hideKeyboard();
				this.region = e.detail.value;
			},
		},
		mounted() {

		},
	}
</script>

<style scoped lang="stylus">
	.container {
		padding-bottom: 100rpx;
	}
	.content-item-con {
		padding: 20rpx;
		margin-top: 16rpx;
		min-height: 160rpx;
		background: #F9F9F9;
	}
	.text-area-item {
		margin: 0;
		padding: 0 10rpx;
		width: auto;
		height: auto;
		min-height: 160rpx;
	}
	.wrong-text {
		height: 40upx;
		color: red;
		font-size: 30upx;
	}

	.resume-bigbox {
		padding: 0 30rpx 40rpx;
		background: #fff;

		.title1 {
			font-size: 30upx;
			font-weight: 400;
			color: rgba(102, 102, 102, 1);
			margin-top: 26upx;
		}

		.cu-form-group {
			padding: 22upx 0;
		}

		.cu-from-change {
			padding-right: 30upx;
		}

		.set-topborder {
			border-top: 0.1upx solid #eeeeee;
		}

		.set-textarea {
			background: #F3F3F3;
			width: 670upx;
			margin-right: 30upx;
			height: 160upx;
			margin-top: 0;
		}
	}

	.submit-btn-item {
		height: 80upx;
		color: #FFFFFF;
		font-size: 30upx;
		border-radius: 4upx;
		margin: 100rpx;
		background: linear-gradient(270deg, rgba(0, 106, 231, 1) 0%, rgba(66, 157, 255, 1) 100%);
	}
</style>
